<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>EaselJS中的"容器</title>
    <script src="../EaselJS/lib/easeljs-0.8.2.min.js"></script>
</head>
<body onload="init();">
    <canvas id="demoCanvas" width="800" height="600"></canvas>
    <script type="text/javascript">
        window.onload=function(){
            var canvas = document.getElementById("demoCanvas");
            var stage = new createjs.Stage(canvas);
            //创建容器
            var container = new createjs.Container();
            //添加容器到stage
            stage.addChild(container);
            stage.on("stagemousedown",moveContainer,null,false);
            function setup(){
                for(var i = 0;i<3;i++){
                    var tempBitMap = new createjs.Bitmap('http://dev.shebao.haodai.net/public/img/banner_index.png');
                    tempBitMap.x = 0;
                    tempBitMap.y = i * 140;
                    //添加图片到容器
                    container.addChild(tempBitMap);
                }
                stage.update();
                setTimeout(function(){stage.update()},1500);
            }

            //鼠标点击后出发的容器移动方法
            function moveContainer(){
                container.x +=20;
                stage.update();
            }

            setup();


        }
    </script>
</body>
</html>